<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button class="start">开始</button>
    <button class="pause">暂停</button>
    <button class="end">结束</button>
    <p>已经摸鱼了<span>0</span>秒</p>

    <script>
        var start = document.querySelector(".start");
        var pause = document.querySelector(".pause");
        var end = document.querySelector(".end");
        var text = document.querySelector("span")

        var t

        start.onclick = function () {
            // text.innerHTML--;
            t = setInterval(function () {
                // text.innerHTML = 10;
                text.innerHTML++;
                start.disabled = true;
                end.disabled = false;
                pause.disabled = false;

            }, 1000)
        }

        pause.onclick = function () {
            // var t = setInterval(function () {
            pause.disabled = true;
            start.disabled = false;
            clearInterval(t)

            // }, 1000)
        }

        end.onclick = function () {
            end.disabled = true;
            start.disabled = false;
            pause.disabled = false;
            clearInterval(t)
            text.innerHTML = 0;
        }
    </script>
</body>

</html>